<template>
<rs-split class="sys-unit" type="vertical" :minSize="300" fixed @resize="onResize" >
    <div class="unit-tree" slot="first">
        <div class="header">机构树</div>
        <RsScrollbar :top="36">
            <el-tree ref="deptTree" 
                :data="depts" 
                :current-node-key="rootKey" 
                :default-expanded-keys="expandKeys" 
                node-key="bmbh" 
                :props="defaultProps" 
                :expand-on-click-node="false" 
                :render-content="renderContent"
                @node-click="handleNodeClick">
            </el-tree>
        </RsScrollbar>
    </div>
    <el-tabs class="unit-wrap" v-model="activeName" type="border-card" ref="unitWrap" slot="last">
        <el-tab-pane label="机构" name="unit">
            <UnitTabPane ref="unitPane" :currentNode="currentNode" :tableHeight="tableHeight"></UnitTabPane>
        </el-tab-pane>
        <el-tab-pane label="人员" name="user">
            <UserTabPane ref="userPane" :currentNode="currentNode" :tableHeight="tableHeight"></UserTabPane>
        </el-tab-pane>
    </el-tabs>
</rs-split>
</template>
<script>
import dom from '@/utils/dom.js'
import tips from '../../mixin/tips'
import UnitTabPane from './unitTabPane'
import UserTabPane from './userTabPane'
import tree from './tree'
import unit from '@/api/unit'
export default {
    name:'UnitPage',
    mixins:[tips,tree],
    components:{UnitTabPane,UserTabPane},
    provide() {
        return {
            unit: this
        };
    },
    data(){
        return {
            activeName:'unit',
            tableHeight:0,
            
        }
    },
    computed:{
        unitName(){
            return this.currentNode?this.currentNode.label:"";
        },
    },
    watch:{
        currentNode(newValue,oldValue){

        }
    },
    created(){
        this.loadTree();
    },
    mounted(){
        this.initCurrentNode();
        // this.$nextTick(()=>{
        //     this.tableHeight = this.getTableHeight();
        // })
    },
    activated(){
        //console.log('activated')
    },
    deactivated(){
        //console.log('deactivated')
    },
    methods:{
        onResize(obj){
            //console.log(obj)
            this.tableHeight = obj.last.height - 105;
        },
        getTableHeight(){
            let h = dom.getStyle(this.$refs.unitWrap.$el,"height");
            //console.log(h)
            return parseFloat(h) - 105;
        }
    }
}
</script>